<template>
  <div class="container">
    <div>今年：{{age}}岁</div>
    <div>明年：{{newAge}}岁</div>

    <input type="text"
           v-model="newAge">
  </div>
</template>

<script>
import { computed, ref } from 'vue'

export default {
  name: 'App',
  setup () {
    const age = ref(16)
    // // 该函数的返回值，就是计算属性的值
    // const newAge = computed(() => {
    //   return age.value + 1
    // })


    // 计算属性高级用法
    const newAge = computed({
      // get获取计算属性的值
      get () {
        return age.value + 2
      },
      set (value) {
        // console.log(value);
        age.value = value - 2
      }
    })

    return { age, newAge }
  }
}
</script>

<style>
</style>